﻿.wrap {
    font-family: "Microsoft YaHei";
}
.title {
    margin-top: .25rem;

    font-size: .40rem;
    font-weight: bold;
    line-height: .70rem;

    color: #2a2a2a;
}
.top-area {
    height: .58rem;

    font-size: .3rem;
    font-weight: bold;
    line-height: .58rem;

    color: #9a9a9a;
}
.author {
    margin-left: .45rem;
}
.imgtxt p {
    font-size: .32rem;
    line-height: .50rem !important;

    letter-spacing: .03rem;

    color: #252525;
}
.imgtxt img {
    display: block;
    margin: .40rem 0 !important;

    text-align: center;
}
.product-item h3 {
    height: .38rem;
    padding-left: .15rem;
    margin: .38rem 0 .29rem 0;

    font-size: .36rem;
    line-height: .38rem;

    color: #252525;
    border-left: .06rem solid #333;
}
.product-item ul{
    margin-left: -2%;
}
.product-item li {
    float: left;
    width: 48%;
    margin-bottom: .15rem;
    margin-left: 2%;
}
.product-item li p.p-title {
    font-size: .28rem;
    line-height: .54rem;

    text-align: center;

    color: #252525;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.product-item li p.p-price {
    font-size: .28rem;
    line-height: .36rem;

    text-align: center;

    color: #acacac;
}
.productshade{
    width:100%;
    height:100%;
    position:fixed;
    display:none;
    top:0px;
    left:0px;
    opacity: .8;
    background: #000;
    background: rgba(0,0,0,.8);
    filter: alpha(opacity=80);
    background-size:100%;
    z-index:9999999;
}

/*搭配样式*/
.pic_tagbox{
    position: relative;
    overflow: hidden;
}
.tag-item {
    position: absolute;
    height: 0.48rem;
}
.tag-item .tag-twinkle {
    position: absolute;
    z-index: 3;
    top:50%;
    margin-top:-0.1rem;
    width: 0.2rem;
    height: 0.2rem;
    border-radius: 100%;
    animation: twinkle 1.5s ease 0s infinite;
    -webkit-animation: twinkle 1.5s ease 0s infinite;
    -moz-animation: twinkle 1.5s ease 0s infinite;
}
@keyframes twinkle{
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        background-color: rgba(255,255,255,0.5);
    }
    100% {
        -webkit-transform: scale(3);
        transform: scale(3);
        background-color: rgba(255,255,255,0);
    }
}
@-moz-keyframes twinkle{
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        background-color: rgba(255,255,255,0.5);
    }
    100% {
        -webkit-transform: scale(3);
        transform: scale(3);
        background-color: rgba(255,255,255,0);
    }
}
@-webkit-keyframes twinkle{
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        background-color: rgba(255,255,255,0.5);
    }
    100% {
        -webkit-transform: scale(3);
        transform: scale(3);
        background-color: rgba(255,255,255,0);
    }
}
.tag-item .tag-dot {
    position: absolute;
    z-index: 5;
    top:50%;
    margin-top:-0.1rem;
    width: 0.1rem;
    height: 0.1rem;
    border: 0.05rem #cfcbc6 solid;
    display: inline-block;
    border-radius: 100%;
    background-color: #171515;
}
.tag-price {
    position:relative;
    width:auto;
    height:0.48rem;
    line-height: 0.48rem;
    background:#0d0a0b;
    border-radius:0.06rem;
    display: block;
    font-size: 0.24rem;
    color: #fff;
    padding: 0 0.1rem;
    box-sizing: border-box;
   white-space: nowrap;
}
.tag-price .arrow {
    position:absolute;
    top: 50%;
    margin-top: -0.1rem;
    border:solid 0.1rem;

}
.tag-price.right{
    right: -0.45rem;
}
.tag-price.left{
    left: -110%;

}
.tag-price.right .arrow{
    left: -0.17rem;
    border-color:transparent #0d0a0b transparent transparent;
}
.tag-price.left .arrow{
    right:-0.17rem;
    border-color:transparent transparent transparent #0d0a0b;
}